<template>
  <div class="content-view">
    <!-- <div style="position: absolute;width:400px;height:400px;" @click="onTestClick">画点东西上去看看</div> -->
    <div id="right-CAD" class="right-CAD" ref="rightCAD" :class="isMouseOver ? 'mask' : ''"></div>
    <!-- @contextmenu.prevent="onTestClick()" -->
    <!-- :target="contextMenuTarget" -->
    <!-- @update:show="(show) => (contextMenuVisible = show)" -->
    <!-- @update:show="(show) => (contextMenuVisible = show)" -->

    <!-- <vue-context-menu class="right-menu" :show="contextMenuVisible" :target="contextMenuTarget"
      @update:show="updateContextMenuShow" v-if="demoInitFlag">
      <div v-for="(item, index) in contextMenuData" :key="index">
        <a @click="onContextMenuClick(item)" :disabled="!item.validable"
          :style="item.validable ? 'color:#000000' : 'color:lightgray'">{{ item.menuText }}</a>
        <div v-if="item.underLine" class="menu-cutoff"></div>
      </div>
    </vue-context-menu> -->
  </div>
</template>

<script>
import * as svg_opt from "@/utils/svg_opt.js";
import {
  getPFD,
  getReadCorrosionThckData,
  getReadSurplusLifeData
} from "../../api/api";
import { component as VueContextMenu } from "@xunlei/vue-context-menu";
import test_linegroup from "@/utils/testdata/test_linegroup";
// import test_pfd from "@/utils/testdata/test_pfd";
import { showLoading, hideLoading } from "@/utils/loading";
import eventBus from "@/eventBus/bus";
import { getLocalStorage } from "@/utils/storage";
import $ from "jquery";

// 导出模块
export default {
  // 模块名字
  name: "CadViewForReading",

  // 模块数据
  components: {
    "vue-context-menu": VueContextMenu
  },

  props: {
    isShow: Boolean,

    leftReadTabelRow: Object,
    styleOptionsValue: Number,
    macType: Number,
    macName: String,

    colorOptionsValue: String,

    legendList: Array,

    // 默认选择的线组号
    defaultSelectLinNumb: Number,

    isMouseOver: Boolean,
  },

  data() {
    //数据
    return {
      MSG: null,
      svgSourceUrl: "",
      sourceExt: "",
      sourceUrl: "",
      isSourcePic: false,

      isSvgLoaded: false,
      isSvgLoading: false,

      ballMarkerPosList: [],

      loadSvgWhenReShow: false,

      contextMenuTarget: {},
      contextMenuVisible: false,
      selectLineGroupData: null,

      pfdData: [],
      contextMenuData: [
        {
          menuText: this.$t("message.reading.cadView.contextMenu.menu0"),
          underLine: false,
          tag: "base-style",
          validable: true
        },
        // {
        //   menuText: this.$t("message.reading.cadView.contextMenu.menu1"),
        //   underLine: false,
        //   tag: "part-style",
        //   validable: false
        // },
        {
          menuText: this.$t("message.reading.cadView.contextMenu.menu2"),
          underLine: true,
          tag: "draw-style",
          validable: true
        },
        {
          menuText: this.$t("message.reading.cadView.contextMenu.menu3"),
          underLine: true,
          tag: "plan",
          validable: true
        },
        {
          menuText: this.$t("message.reading.cadView.contextMenu.menu4"),
          underLine: false,
          tag: "check-result",
          validable: true
        },
        {
          menuText: this.$t("message.reading.cadView.contextMenu.menu5"),
          underLine: true,
          tag: "bh-reading",
          validable: true
        },
        // {
        //   menuText: this.$t("message.reading.cadView.contextMenu.menu6"),
        //   underLine: true,
        //   tag: "check-reading",
        //   validable: false
        // },
        {
          menuText: this.$t("message.reading.cadView.contextMenu.menu7"),
          underLine: false,
          tag: "fit-draw",
          validable: true
        }
      ],

      legendData: {
        // legendSig: "",
        legendArray: []
      },
      demoInitFlag: false,

      externalSelectLineGroup: -1,
      IMG: {
        width: 0,
        height: 0
      }
    };
  },

  watch: {

    leftReadTabelRow: {
      deep: true,
      handler: function (newV, oldV) {
        // debugger
        console.log("leftReadTabelRow  ????----????", newV);
        // debugger
        // if (newV && oldV && newV.pdfFile == oldV.pdfFile) {
        //   return;
        // }
        if (!newV) {
          svg_opt.removeSvg();
          svg_opt.clearAllMarkups();
          return
        }
        this.IMG = {
          width: newV.width,
          height: newV.height
        }
        console.log("leftReadTabelRow  do logic");

        if (newV) this.requireSvgData(newV.pdfFile);
        else {
          this.requireSvgData(null);
          //     this.onTableItemSelect(null);
          this.onLineGroupSelect(null);
        }
      }
    },

    isShow(val) {
      if (this.loadSvgWhenReShow && val) {
        this.loadSvg();
        this.loadSvgWhenReShow = false;
      }
    },

    isMouseOver(val) {
      console.log(val)

    },

    colorOptionsValue(val) { },

    legendList(val) {
      // debugger
      console.log("legendList(val)");
      console.log(JSON.stringify(''));
      // legendData
      if (val.length == 0) {
        // this.legendData.legendSig = "";
        this.clearLineGroupColor();
        this.legendData.legendArray = [];
        this.requirePfdData();
        return;
      }

      let sig = val[0].judg_sig;
      // this.legendData.legendSig = sig;

      let isUp = true;
      if (sig == "≦" || sig == "＜" || sig == "<=" || sig == "<") isUp = true;
      else if (sig == "≧" || sig == "＞" || sig == ">=" || sig == ">")
        isUp = false;

      let legendArray = JSON.parse(JSON.stringify(val));

      legendArray.sort((a, b) => {
        if (isUp) a.judg_crr - b.judg_crr;
        else b.judg_crr - a.judg_crr;
      });
      this.legendData.legendArray = legendArray;

      if (this.colorOptionsValue == 206 || this.colorOptionsValue == 667)
        this.requireReadCorrosionThckData();
      else if (this.colorOptionsValue == 215) this.requireReadSurplusLifeData();
      else if (this.colorOptionsValue == 0) {
        this.clearLineGroupColor();
      }
    },

    defaultSelectLinNumb(val) {
      console.log(val);
      this.setDefaultSelectLineGroup(true);
    }
  },

  methods: {
    /**
     * 加载svg图纸 svg格式正常加载  位图格式先加载基础svg 在onSvgLoaded替换位图
     */
    requireSvgData(inSourceUrl) {
      if (inSourceUrl == null || typeof inSourceUrl == "undefined") {
        svg_opt.removeSvg();
        return;
      }

      let num = inSourceUrl.lastIndexOf(".") + 1;
      this.sourceExt = inSourceUrl.substring(num);
      this.sourceUrl = inSourceUrl;

      let EXT = this.sourceExt
      if (
        EXT == "png" ||
        EXT == "jpg" ||
        EXT == "gif" ||
        EXT == "bmp" ||
        EXT == "jpeg" ||
        EXT == "tif" ||
        EXT == "tiff"
      ) {
        this.isSourcePic = true;
        this.svgSourceUrl = require("@/assets/model/method-draw-image.svg");
      } else {
        this.isSourcePic = false;
        this.svgSourceUrl = inSourceUrl;
      }

      this.loadSvg();
    },

    /**
     * 获取线 组数据
     */
    requirePfdData() {
      try {
        svg_opt.clearAllMarkups();
      } catch (error) {

      }
      let dataJson = {
        proCode: this.leftReadTabelRow.proCode,
        pltCode: Number(this.leftReadTabelRow.pltCode) || Number(this.$store.state.pltCode),
        Account: this.$parent.$options.name == "Reading" ? getLocalStorage("userName") : '',
        Type: this.$parent.$options.name == "Reading" ? 1 : 2,
      };

      getPFD(dataJson).then(res => {

        console.log(res.data, "ssssssssssssss", this.$message.isVisible);
        if (res.data.code == 1) {
          this.pfdData = [];
          this.$alert(res.data.data, '', {
            confirmButtonText: 'OK',
            type: 'warning',
          });
          return;
        }
        if (res.data.code != 0) {
          this.pfdData = [];
          // this.$alert(res.data.msg, '', {
          //   confirmButtonText: 'OK',
          //   type: 'warning',
          // });

          return;
        }
        let tempData = res.data.data;
        this.pfdData = this.genLineGroupAndShow(tempData);
        // svg_opt.testAddLineGroupsByParams(this.pfdData);
        // svg_opt.clearAllMarkups();
        // svg_opt.testAddLineGroupsByParams(this.pfdData);
        this.requireReadCorrosionThckData();
      });
    },

    /**
     * 余寿命着色数据
     */
    requireReadSurplusLifeData() {
      let dataJson = {
        proCode: this.leftReadTabelRow.proCode,
        pltCode: this.leftReadTabelRow.pltCode,
        pageIndex: 1,
        pageSize: 1000
      };
      getReadSurplusLifeData(dataJson).then(res => {
        console.log(res, "5555555555555");
        if (res.data.code != 0) {
          return;
        }
        let tempData = res.data.data;
        tempData.forEach(element => {
          element.linNumb = element.liN_NUMB;
          element.macMax = element.yer;
        });
        this.updateLineGroupAndShowByMacMax(tempData);
        // this.requireSelectLineGroup();
        this.setDefaultSelectLineGroup();
      });
    },

    /**
     * 腐蚀率、餐肉厚着色数据
     */
    requireReadCorrosionThckData() {
      let dataJson = {
        type:
          this.colorOptionsValue == 206
            ? 1
            : this.colorOptionsValue == 667
              ? 2
              : 1,
        proCode: this.leftReadTabelRow.proCode,
        pltCode: this.leftReadTabelRow.pltCode,
        pageIndex: 1,
        pageSize: 1000
      };
      getReadCorrosionThckData(dataJson).then(res => {
        console.log(res, "22222222222222");
        if (res.data.code != 0) {
          this.updateLineGroupAndShowByMacMax([]);
          // this.requireSelectLineGroup();
          this.setDefaultSelectLineGroup();
          return;
        }
        let tempData = res.data.data;
        this.updateLineGroupAndShowByMacMax(tempData);
        // this.requireSelectLineGroup();
        this.setDefaultSelectLineGroup();
      });
    },

    setDefaultSelectLineGroup(isForce = false) {
      let temp = null;
      if (isForce) {
        temp = {
          linNumb1: this.defaultSelectLinNumb,
          prlNo: this.defaultSelectLinNumb
        };
      } else if (this.selectLineGroupData) {
        temp = this.selectLineGroupData;
      } else if (this.defaultSelectLinNumb >= 0) {
        temp = {
          linNumb1: this.defaultSelectLinNumb,
          prlNo: this.defaultSelectLinNumb
        };
      } else if (this.defaultSelectLinNumb == -1) {
        temp = {
          linNumb1: this.pfdData[0].prlNo,
          prlNo: this.pfdData[0].prlNo
        };
      } else {
        // 不做任何操作 返回阅览  没有査到対应的线组
        temp = {
          linNumb1: this.pfdData[0].prlNo,
          prlNo: this.pfdData[0].prlNo
        };
      }

      if (temp != null) {
        this.onTableItemSelect(temp);
        if (!isForce) this.onLineGroupSelect(temp);
      } else {
        if (this.$store.state.rdStyleCode == 3)
          // 图纸页面弹出提示
          this.$alert(this.$t("message.reading.nullSelectTip"), '', {
            confirmButtonText: 'OK',
            type: 'warning',
          });
      }
    },

    genLineGroupAndShow(originData) {
      let lineGroups = [];
      let lastPrl = "";

      // 遍历节点
      for (let i = 0; i < originData.length; i++) {
        //   debugger
        let tempData = originData[i];
        let tempLineGroup = null;

        // 如果当前节点与上一个节点的线组号不同，新建线组，压入线组list
        if (lastPrl != tempData.prlNo) {
          tempLineGroup = {};
          lineGroups.push(tempLineGroup);

          tempLineGroup.defaultLineColor = "#0000ff11";
          tempLineGroup.defaultLineWidth = "10";
          tempLineGroup.prlNo = tempData.prlNo;
          tempLineGroup.groupItems = [];
          tempLineGroup.sId = tempData.prlNo;
          tempLineGroup.fEntType = 17;
          // tempLineGroup.text = "111111";
        }

        // 取最近一个线组
        tempLineGroup = lineGroups[lineGroups.length - 1];

        // 如果线组为空 根据当前节点创建
        if (
          tempLineGroup.groupItems.length == 0 ||
          tempLineGroup.groupItems[tempLineGroup.groupItems.length - 1].dtlNo !=
          tempData.dtlNo
        ) {
          let newItem = {};
          newItem.dtlNo = tempData.dtlNo;
          newItem.shapeType =
            tempData.prlType == 1
              ? "line"
              : tempData.prlType == 2
                ? "closeline"
                : "rect";
          newItem.fEntType = "17";
          newItem.text = tempData.title.split("_")[0];
          newItem.points = [];
          if (this.isSourcePic) {
            newItem.points.push({ x: tempData.prlX, y: tempData.prlY < 0 ? Math.abs(tempData.prlY) : 0 - Math.abs(tempData.prlY) });
          } else {
            newItem.points.push({ x: tempData.prlX, y: tempData.prlY });
          }
          tempLineGroup.groupItems.push(newItem);
        } else if (
          tempLineGroup.groupItems[tempLineGroup.groupItems.length - 1].dtlNo ==
          tempData.dtlNo &&
          tempLineGroup.groupItems[tempLineGroup.groupItems.length - 1].points
            .length >= 2
        ) {
          let newItem = {};
          newItem.dtlNo = tempData.dtlNo;
          newItem.shapeType =
            tempData.prlType == 1
              ? "line"
              : tempData.prlType == 2
                ? "closeline"
                : "rect";
          newItem.fEntType = "17";
          // newItem.text = "33333";
          newItem.points = [];

          newItem.points.push(
            tempLineGroup.groupItems[tempLineGroup.groupItems.length - 1]
              .points[
            tempLineGroup.groupItems[tempLineGroup.groupItems.length - 1]
              .points.length - 1
            ]
          );

          if (this.isSourcePic) {
            newItem.points.push({ x: tempData.prlX, y: tempData.prlY < 0 ? Math.abs(tempData.prlY) : 0 - Math.abs(tempData.prlY) });
          } else {
            newItem.points.push({ x: tempData.prlX, y: tempData.prlY });
          }
          tempLineGroup.groupItems.push(newItem);
        } else if (
          tempLineGroup.groupItems[tempLineGroup.groupItems.length - 1].dtlNo ==
          tempData.dtlNo
        ) {
          if (this.isSourcePic) {
            // newItem.points.push({ x: tempData.prlX, y: 0 - Math.abs(tempData.prlY) });
            tempLineGroup.groupItems[
              tempLineGroup.groupItems.length - 1
            ].points.push({ x: tempData.prlX, y: tempData.prlY < 0 ? Math.abs(tempData.prlY) : 0 - Math.abs(tempData.prlY) });
          } else {
            // newItem.points.push({ x: tempData.prlX, y: tempData.prlY });
            tempLineGroup.groupItems[
              tempLineGroup.groupItems.length - 1
            ].points.push({ x: tempData.prlX, y: tempData.prlY });
          }
          // tempLineGroup.groupItems[
          //   tempLineGroup.groupItems.length - 1
          // ].points.push({ x: tempData.prlX, y: tempData.prlY });
        }

        lastPrl = tempLineGroup.prlNo;
      }

      console.log(lineGroups);
      return lineGroups;
    },

    /**
     * 清空线组颜色、清空图纸上的markup、重新绘制线组
     */
    clearLineGroupColor() {
      this.pfdData.forEach(element => {
        element.defaultLineColor = "#0000ff11";
      });
      svg_opt.clearAllMarkups();
      // debugger
      console.log(this.pfdData)
      svg_opt.testAddLineGroupsByParams(this.pfdData);
      if (this.selectLineGroupData)
        svg_opt.changeSelectStatusById(this.selectLineGroupData.prlNo);
    },

    /**
     * 更新线组颜色数据
     */
    updateLineGroupAndShowByMacMax(corrosData) {
      var corrosDataMap = corrosData.map(function (o) {
        return o.linNumb;
      });
      // console.log(corrosDataMap)
      for (let i = 0; i < this.pfdData.length; i++) {
        let lineGroupPrlNo = this.pfdData[i].prlNo;
        let corrosIndex = corrosDataMap.indexOf(lineGroupPrlNo);
        if (corrosIndex == -1) {
          this.pfdData[i].defaultLineColor = (this.legendData.legendArray == 0 && !this.$store.state.btn_set_BHView && this.$parent.$options.name == "Reading") ? "#FF7F27" : "#ff000011";
          continue;
        }

        // debugger
        let corrosItem = corrosData[corrosIndex];
        this.genLineGroupColor(this.pfdData[i], corrosItem);
      }

      console.log(this.pfdData);
      svg_opt.clearAllMarkups();
      svg_opt.testAddLineGroupsByParams(this.pfdData);
      if (this.selectLineGroupData)
        svg_opt.changeSelectStatusById(this.selectLineGroupData.prlNo);
    },

    /**
     * 根据着色数据为线组上色
     */
    genLineGroupColor(inLineGroup, inCorrosItem) {
      // if (sig == "≦" || sig == "＜" || sig == "<="  || sig == "<" ) isUp = true;
      // else if( sig == "≧" || sig == "＞" || sig == ">="  || sig == ">") isUp = false;

      //       legendData: {
      //   legendSig: "",
      //   legendArray: [],
      // },
      // debugger
      console.log(this.$parent.$options.name);
      if (this.legendData.legendArray == 0 && !this.$store.state.btn_set_BHView && this.$parent.$options.name == "Reading") {
        inLineGroup.defaultLineColor = "#FF7F27";
      }

      for (let i = 0; i < this.legendData.legendArray.length; i++) {
        let tempValue = this.legendData.legendArray[i].judg_crr;
        let tempSig = this.legendData.legendArray[i].judg_sig;

        if (
          (tempSig == "≦" || tempSig == "<=") &&
          inCorrosItem.macMax <= tempValue
        ) {
          inLineGroup.defaultLineColor = this.legendData.legendArray[i].color;
          return;
        } else if (
          (tempSig == "＜" || tempSig == "<") &&
          inCorrosItem.macMax < tempValue
        ) {
          inLineGroup.defaultLineColor = this.legendData.legendArray[i].color;
          return;
        } else if (
          (tempSig == "≧" || tempSig == ">=") &&
          inCorrosItem.macMax >= tempValue
        ) {
          inLineGroup.defaultLineColor = this.legendData.legendArray[i].color;
          return;
        } else if (
          (tempSig == "＞" || tempSig == ">") &&
          inCorrosItem.macMax > tempValue
        ) {
          inLineGroup.defaultLineColor = this.legendData.legendArray[i].color;
          return;
        } else {
          inLineGroup.defaultLineColor = "#ff000011";
        }
      }
    },

    loadSvg() {
      if (!this.svgSourceUrl || this.svgSourceUrl == "") {
        eventBus.$emit('isNoSvg')
        svg_opt.removeSvg();
        return;
      }

      if (this.isSvgLoading) return;

      this.isSvgLoading = true;
      showLoading();
      svg_opt.setSvgLineWidthRatio(1.5);
      svg_opt.setSvgBoundingBoxRatio(0, 0, 1);
      // svg_opt.setSvgBoundingBoxRatio(0, -140, 1);
      // svg_opt.setCanClickSelectMarkup(true,[1,2,3,4,5,6,7,8,9,10,11,12]);
      svg_opt.setCanClickSelectMarkup(true);

      svg_opt.setCanEditSelectMarkup(false);
      svg_opt.setCanFitPositionAndScale(false);
      svg_opt.setEditDotWidthRatio(3);
      svg_opt.setSelectCallBack(this.onLineGroupSelect);
      setInterval(() => {
        hideLoading();
      }, 1000);
      let num = this.leftReadTabelRow.proPass.lastIndexOf(".") + 1;
      var originExt = this.leftReadTabelRow.proPass.substring(num);
      svg_opt.AddSvg(this.svgSourceUrl, "right-CAD", this.onSvgMousePosChange, true, this.IMG.width, this.IMG.height,
                    originExt == "wmf" ? 1 : -1);
      svg_opt.SetSvgMouseMode(0);
      svg_opt.setLoadCallBack(this.onSvgLoaded);
      svg_opt.setLeftMouseClickFun(() => {
        this.contextMenuVisible = false;
        // svg_opt.clearSelectedState();
      });
    },

    onSvgMousePosChange(posX, posY) {
      // console.log("onSvgMousePosChange " + posX + " " + posY);
      // console.log($("rect"))
      // $("#g-markupundefined").on("mouseenter", ()=>{
      //   console.log("1111111")
      // })
    },

    onSvgLoaded(error) {
      console.log("onSvgLoaded --- ", error);
      this.isSvgLoading = false;
      hideLoading();
      if (error) {
        console.log(error);
        return;
      }

      this.isSvgLoaded = true;

      if (this.isSourcePic) {
        svg_opt.changeSvgElementData({
          tagName: "img-content",
          paramName: "xlink:href",
          newValue: this.sourceUrl
        });
        svg_opt.changeSvgElementData({
          tagName: "img-content",
          paramName: "width",
          newValue: this.IMG.width
        });
        svg_opt.changeSvgElementData({
          tagName: "img-content",
          paramName: "height",
          newValue: this.IMG.height
        });
      }

      this.requirePfdData();
    },

    onTestClick() {
      // svg_opt.testAddLineGroupsByParams(test_linegroup);
      console.log("onTestClick");
    },

    /**
     * 判断右键菜单是否显示
     * 有选中线组，显示
     * 无选中线组：不显示
     */
    updateContextMenuShow(inShow) {
      console.log("updateShow(inShow)" + inShow);
      if (this.selectLineGroupData != null) this.contextMenuVisible = inShow;
      else this.contextMenuVisible = false;
    },

    /**
     * 线组选中
     */
    onLineGroupSelect(e) {
      //       if (e == null) return;
      console.log(e)
      if (!this.leftReadTabelRow) {
        this.$emit("onLineGroupClick", { prlNo: '' })
        return
      }
      this.$emit("onLineGroupClick", e)
      this.selectLineGroupData = e;
      // eventBus.$emit("pfdRelationSelectTableRow", e);

    },

    /**
     * 右键菜单
     */
    onContextMenuClick(e) {
      console.log(e);
      this.contextMenuVisible = false;
      if (e.tag == "fit-draw") {
        svg_opt.ResetSvgView();
      } else if (
        e.tag == "bh-reading" ||
        e.tag == "check-result" ||
        e.tag == "draw-style" ||
        e.tag == "base-style"
      ) {
        this.$emit("onCadContextMenuClick", {
          prlNo: this.selectLineGroupData.prlNo,
          tag: e.tag
        });
      } else if (e.tag == 'plan') {
        eventBus.$emit('goPlanView', 3, 'PlanVIew')
        // 1 '/PlanView'
      } else {
        this.$message({
          message: e.menuText,
          type: "info"
        });
      }
    },

    /**
     * 表格选中
     */
    onTableItemSelect(e) {
      console.log(e.linNumb1 || e.prlNo);
      svg_opt.changeSelectStatusById(e.linNumb1 || e.prlNo);
      // this.selectLineGroupData
      this.pfdData.forEach(element => {
        if (element.prlNo == e.linNumb1 || element.prlNo == e.prlNo) {
          this.selectLineGroupData = element;
          return;
        }
      });
    },

    /**
     * 获取选中线组的线组号
     */
    getSelectLineGroupPrlNo() {
      if (this.selectLineGroupData) return this.selectLineGroupData.prlNo;
      return null;
    }
  },

  mounted() {

    $('#right-CAD').on('contextmenu', function (event) {
      event.preventDefault(); // 阻止默认的右键菜单  
      // alert('Right-clicked on #right-CAD!');
      // 你可以在这里添加更多的处理逻辑  
      svg_opt.ResetSvgView();
    });

    eventBus.$on("reGetPFD", (arr) => {
      this.requirePfdData();
    })
    eventBus.$on("cardForReadingClick", (arr) => {
      // 清空markup
      // this.pfdData.forEach(element => {
      //   element.defaultLineColor = "#0000ff11";
      // });
      try {
        svg_opt.clearAllMarkups();
        svg_opt.testAddLineGroupsByParams(this.pfdData);
        this.onLineGroupSelect({ prlNo: "" })
        //重新绘制
        arr.forEach((i, v) => {
          svg_opt.changeSelectStatusById(i.linNumb, true, false);

          this.onLineGroupSelect({ prlNo: i.linNumb })
        })
      } catch (error) {

      }
      // svg_opt.changeSelectStatusById(this.selectLineGroupData.prlNo);
    })
    // this.requireSvgData(
    //   "http://13.230.43.124:8055\\FileSummary\\JGC_0_d4ad8696-f6a7-4923-bf49-8ee410535356_442606_20201207164355979255.bmp"
    // );
    var _self = this;
    this.$nextTick(function () {
      _self.contextMenuTarget = _self.$refs.rightCAD;
      // _self.requireSvgData(this.leftReadTabelRow.pdfFile); // 初始化后不主动加载图纸
      _self.demoInitFlag = true;
    });
  },
  beforeDestroy() {
    eventBus.$off("cardForReadingClick");
    eventBus.$off("reGetPFD");
  },
  onShow() {
    console.log("CadViewForMSDetail onshow");
  }
};
</script>

<style lang="scss" scoped>
.content-view {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-start;
  background-color: #ffffff;

  .right-CAD {
    float: left;
    width: 100%;
    height: calc(100%);
  }
}

.right-menu {
  position: fixed;
  background: #fff;
  border: solid 1px rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  background-color: lightgray;
  z-index: 999;
  display: none;

  padding-left: 20px;
}

.right-menu a {
  width: 125px;
  height: 35px;
  line-height: 35px;
  text-align: center;
  display: block;
  color: #1a1a1a;
  background-color: #fff;
}

.right-menu a:hover {
  background: #eee;
  color: #fff;
}

html,
body {
  height: 100%;
}

.right-menu {
  border: 1px solid #eee;
  box-shadow: 0 0.5em 1em 0 rgba(0, 0, 0, 0.1);
  border-radius: 1px;
}

a {
  text-decoration: none;
}

.right-menu a {
  padding: 2px;
}

.right-menu a:hover {
  background-color: rgb(176, 157, 247);
}

.menu-cutoff {
  width: 100%;
  height: 1px;
  background-color: lightgray;
}

#g-content {
  fill: red !important;
}

#right-CAD {
  cursor: pointer;
  position: relative;
}

.mask::after {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  cursor: not-allowed;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 50;
}
</style>
